<template>
  <div class="flex justify-between">
    <div class="flex">
      <div><img src="" alt="logo" /></div>
      <div class="text-left ml-2">
        <h4>虚拟图书馆</h4>
        <p>星海</p>
      </div>
    </div>
    <div class="flex">
      <div class="flex">
        <form class="flex" action="" @submit.prevent="handleSubmit">
          <select name="Select" v-model="formData.seleValue" id="">
            <option value="Input" name="Input">任意词</option>
            <option value="Title" name="Title">题名</option>
            <option value="Author" name="Author">责任者</option>
          </select>
          <div class="border-1 border-rose-600">
            <input
              type="text"
              v-model="formData.inputValue"
              placeholder="检索..."
            />
            <button type="submit">检索</button>
          </div>
        </form>
      </div>
      <div @click="handleLogin">登录/注册</div>
    </div>
  </div>
</template>
<script setup lang="ts">
  import { reactive } from "vue";
  import { useRouter } from "vue-router";
  import { getSearchFind } from "@/api/vrsite";
  import type { SearchResult } from "@/store/search";
  import { useSearchStore } from "@/store/search";
  import crypto from "@/utils/crypto";
  let router = useRouter();

  const formData = reactive({
    seleValue: "Input",
    inputValue: "",
    titleValue: ""
  });
  const props = defineProps<{ type: string }>();
  const searchStore = useSearchStore();

  const handleLogin = () => {
    router.push("/login");
  };
  const handleSubmit = (e: Event) => {
    console.log(e);
    console.log(formData);
    getList();
  };
  const getList = () => {
    getSearchFind({ a: { Input: formData.inputValue, Type: props.type } }).then(
      (res: any) => {
        // console.log(res);
        const { vr_ifa_Site_Find_list1: list1 } = res;
        const results = crypto.decryptArray<SearchResult>(list1);

        searchStore.setResults(results);
        console.log(searchStore.results);
      }
    );
  };
</script>
<style scoped lang="scss">
  div {
    font-size: 16px;
  }
</style>
